import { useState, cloneElement } from "react"

export default function useHover(element) {
    const [state, setState] = useState(false);

    if (typeof element === 'function') {
        element = element(state);  //jsx
    }
    // 得到一个对象并绑定事件
    const dom = cloneElement(element, {
        onMouseEnter: () => setState(true),
        onMouseLeave: () => setState(false)
    })

    return [dom, state]
}